<template>
  <div class="customerOverview-container">
    <div class="customerOverview-page">
      <el-card>
        <div>
           <el-button size="small" type="primary" @click="showGoodsLine('add','')">新增产品线</el-button>
        </div>
        <el-table :data="list" border style="width: 100%; margin: 20px 0" v-loading="listLoading">
          <el-table-column
            label="产品线"
            align="center"
            min-width="100">
            <template slot-scope="scope">
                 {{scope.row.goodsLineName}}
            </template>
          </el-table-column>
          <el-table-column
            align="center"
            label="负责人"
            min-width="150">
            <template slot-scope="scope">
                {{scope.row.userName}}
            </template>
          </el-table-column>
          <el-table-column
            align="center"
            label="客户关注点"
            min-width="150">
            <template slot-scope="scope">
              {{scope.row.cglCustomerFocusStr}}
            </template>
          </el-table-column>
          <el-table-column
            align="center"
            label="采购习惯"
            min-width="150">
            <template slot-scope="scope">
              {{scope.row.cglBuyHabitsStr}}
            </template>
          </el-table-column>
          <el-table-column
            align="center"
            label="使用材料"
            min-width="150">
            <template slot-scope="scope">
              {{scope.row.goodsSn}}
            </template>
          </el-table-column>
          <el-table-column
            align="center"
            label="月使用量"
            min-width="150">
            <template slot-scope="scope">
              {{scope.row.cglMonthBuyNum}}
            </template>
          </el-table-column>
          <el-table-column
            align="center"
            label="最新跟进时间"
            min-width="150">
            <template slot-scope="scope">
              {{scope.row.cglTrackingTime}}
            </template>
          </el-table-column>
          <el-table-column
            align="center"
            label="最新成交时间"
            min-width="150">
            <template slot-scope="scope">
              {{scope.row.cglOrderTime}}
            </template>
          </el-table-column>
          <el-table-column
            align="center"
            label="竞争对手情况"
            min-width="150">
            <template slot-scope="scope">
              {{scope.row.cglCompetitorInfoStr}}
            </template>
          </el-table-column>
          <el-table-column
            align="center"
            label="竞争对手类型"
            min-width="150">
            <template slot-scope="scope">
              {{scope.row.cglCompetitorType}}
            </template>
          </el-table-column>
          <el-table-column
            align="center"
            label="规模"
            min-width="150">
            <template slot-scope="scope">
              {{scope.row.cglScale}}
            </template>
          </el-table-column>
          <el-table-column
            align="center"
            label="开工率"
            min-width="150">
            <template slot-scope="scope">
              {{scope.row.cglOperatingRate}}%
            </template>
          </el-table-column>
          <el-table-column
            align="center"
            label="支付方式"
            min-width="150">
            <template slot-scope="scope">
              {{scope.row.cglPayMethod}}
            </template>
          </el-table-column>
          <el-table-column
            align="center"
            label="产品匹配度"
            min-width="150">
            <template slot-scope="scope">
              {{scope.row.goodsMatchDegree}}
            </template>
          </el-table-column>
          <el-table-column
            align="center"
            label="更新时间"
            min-width="150">
            <template slot-scope="scope">
              {{scope.row.updateTime}}
            </template>
          </el-table-column>
          <el-table-column
            align="center"
            label="更新人"
            min-width="150">
            <template slot-scope="scope">
                  {{scope.row.updateUserName}}
            </template>
          </el-table-column>
          <el-table-column
            align="center"
            label="创建人"
            min-width="150">
            <template slot-scope="scope">
              {{scope.row.createUserName}}
            </template>
          </el-table-column>
          <el-table-column
            align="center"
            label="创建时间"
            min-width="150">
            <template slot-scope="scope">
              {{scope.row.createTime}}
            </template>
          </el-table-column>
          <el-table-column
            align="center"
            label="审核状态"
            min-width="150">
            <template slot-scope="scope">
              {{scope.row.cglCheckState == 1 ? '已审核' : '未审核'}}
            </template>
          </el-table-column>
          <el-table-column
            fixed="right"
            align="center"
            label="操作"
            min-width="150">
            <template slot-scope="scope">
                <el-button type="text" @click="showGoodsLine('edit',scope.row)">编辑</el-button>
                <el-button type="text" @click="delItem(scope.row)" v-if="scope.row.isCanDelete == 1">删除</el-button>
<!--                <el-button type="text">复制</el-button>-->
            </template>
          </el-table-column>
        </el-table>

      </el-card>
    </div>

    <addGoodsLine ref="addGoodsLine" @getList="getList"></addGoodsLine>

  </div>
</template>

<script>
import { mapGetters } from 'vuex'
import {formatDate} from '@/utils/date';
import store from '@/store'
import {getCustomerOption, addRelatio, delRelation,} from '@/api/partner'
import addGoodsLine from './addGoodsLine'
import {developGoodsLineList,customerNewBaseInfo,developDelGoodsLine} from '@/api/company'

const defaultListQuery={
  customerId:'',
  isMy:1

};

export default {
  name: "customerGoodsLine",
  data(){
    return{
      roles:store.getters.roles ? store.getters.roles : [],
      list:[],
      listQuery: JSON.parse(JSON.stringify(defaultListQuery)),
      count: 0,
      listLoading: false,
      info:{}
    }
  },
  components : {
    addGoodsLine
  },
  computed: {
    ...mapGetters([
      'name',
      'mobile',
      'userId'
    ]),

  },
  created() {

  },
  filters: {

  },
  methods:{
    init(customerId){
      this.listQuery.customerId = customerId;
      this.getList();
      this.getInfo()
    },
    delItem(item){
      this.$confirm('确定删除此条记录?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        developDelGoodsLine({cglId:item.cglId}).then(()=>{
          this.getList();
          this.$message({
            type: 'success',
            message: '删除成功!'
          });
        });
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消删除'
        });
      });
    },

    showGoodsLine(type,item){
      let data = {}
      if(type == 'edit'){
        data = JSON.parse(JSON.stringify(item))
      }
      data.customerId = this.listQuery.customerId,
      data.customerName = this.info.customerName
      this.$refs.addGoodsLine.showPop(type,data)
    },
    //获取客户基本信息
    getInfo(){
      customerNewBaseInfo({customerId:this.listQuery.customerId}).then((res)=>{
        this.info = res
      })
    },
    //获取列表
    getList() {
      this.listLoading = true;
      developGoodsLineList(this.listQuery).then(response => {
        this.list = response;
        this.listLoading = false;
      }).catch(()=>{
        this.listLoading = false;
      });
    },
  }
}
</script>

<style lang="scss">


</style>
